/**
 * Created by Administrator on 2017/3/9.
 */
var Label = require('../../../src/libs/label');
var Input = require('../../../src/libs/input');
var Password = require('../../../src/libs/password');
var Button = require('../../../src/libs/button');
var Checkbox = require('../../../src/libs/checkbox');
var HyperLink = require('../../../src/libs/hyperlink');
var FormItem = require('../../../src/libs/form-item');

var Root = React.createClass({
    _getCoce:function(){
        var PageDM = window.PageDM;
        var count = PageDM.getBtnCode.count;
        if(PageDM.getBtnCode.onClick()){
            var _node = this.refs.getcode;
            _node.className = "ucs-btn ucs-btn-code ucs-btn-disabled";
            _node.innerHTML = count + "秒后重新获取";
            _node.disabled = true;
            var time = setInterval(function(){
                if(count > 0){
                    count--;
                    _node.innerHTML = count + "秒后重新获取";
                }else{
                    clearInterval(time);
                    _node.className = "ucs-btn ucs-btn-confirm";
                    _node.innerHTML = "获取验证码";
                    _node.disabled = false;
                }
            },1000);
        }
    },
    _checkClick:function(_checked){
        PageDM.checkboxDM.setValue(_checked);
    },
    componentDidMount:function(){
        //console.log(PageDM.checkboxDM);
    },
    render:function(){
        UEventHub.on(PageDM.checkboxDM.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT,function(v){
            PageDM.checkboxDM.onClick(v);
        }.bind(this));
        PageDM.checkboxDM.setValue(PageDM.checkboxDM.setChecked);
        return(
            <div>
                <FormItem label={PageDM.input1.label} dmbind={PageDM.input1.dmbind}>
                    <Input id={PageDM.input1.id} className="ucs-input" name={PageDM.input1.name} placeholder={PageDM.input1.placeholder} value={PageDM.input1.value} dmbind={PageDM.input1.dmbind}/>
                </FormItem>
                <FormItem label={PageDM.input2.label} dmbind={PageDM.input2.dmbind}>
                    <input id={PageDM.input2.id} className="ucs-input ucs-input-code" type="text" name={PageDM.input2.name} placeholder={PageDM.input2.placeholder} value={PageDM.input2.value} dmbind={PageDM.input2.dmbind}/>
                    <HyperLink text={<img src={PageDM.imgCode.value} className="f-left img-code" ref="imgcode" style="height:40px"/>} onclick={PageDM.imgCode.onClick}/>
                </FormItem>
                <FormItem label={PageDM.msgDM.label} dmbind={PageDM.msgDM.dmbind}>
                    <input id={PageDM.msgDM.id} name={PageDM.msgDM.name} className="ucs-input ucs-input-code" placeholder={PageDM.msgDM.placeholder} value={PageDM.msgDM.value} dmbind={PageDM.msgDM.dmbind}/>
                    <button id={PageDM.getBtnCode.id} ref="getcode" name={PageDM.getBtnCode.name} className="ucs-btn ucs-btn-confirm" onclick={this._getCoce.bind(this)}>获取验证码</button>
                </FormItem>
                <FormItem label={PageDM.pswDM.label} dmbind={PageDM.pswDM.dmbind}>
                    <Password id={PageDM.pswDM.id} className="ucs-input" name={PageDM.pswDM.name} placeholder={PageDM.pswDM.placeholder} value={PageDM.pswDM.value} dmbind={PageDM.pswDM.dmbind}/>
                </FormItem>
                <FormItem label={PageDM.pswDM2.label} dmbind={PageDM.pswDM2.dmbind}>
                    <Password id={PageDM.pswDM2.id} className="ucs-input" name={PageDM.pswDM2.name} placeholder={PageDM.pswDM2.placeholder} value={PageDM.pswDM2.value} dmbind={PageDM.pswDM2.dmbind}/>
                </FormItem>
                <FormItem label={PageDM.tjDM.label} dmbind={PageDM.tjDM.dmbind}>
                    <Input id={PageDM.tjDM.id} className="ucs-input" name={PageDM.tjDM.name} placeholder={PageDM.tjDM.placeholder} value={PageDM.tjDM.value} dmbind={PageDM.tjDM.dmbind}/>
                </FormItem>
                <div className="ucs-form-group">
                    <label className="ucs-label">&nbsp;</label>
                    <div className="input">
                        {/*<input type="checkbox" checked={PageDM.checkboxDM.setChecked} ref="checkedbox" onclick={this._checkClick.bind(this)}/>
                            <span>我已阅读并同意</span>*/}
                        <Checkbox checked={PageDM.checkboxDM.setChecked} text="我已阅读并同意" ref="checkedbox" onclick={this._checkClick.bind(this)}/>
                        <HyperLink href="#" className="fc-link" text="《 绵阳市商业银行平台服务协议（个人版）》 "/>
                    </div>
                </div>
                <div className="ucs-form-group auto-height">
                    <Label value="&nbsp;"/>
                    <div className="input">
                        <Button value="注册" id={PageDM.btn1.id} className="ucs-btn ucs-btn-confirm" onclick = {PageDM.btn1.onClick}/>
                    </div>
                </div>
            </div>
        )
    }
});
ReactDOM.render(<Root/>, document.getElementById('main'));